<template >

    <a-card :bordered="false">
      <!-- 查询区域 -->
      <div class="table-page-search-wrapper">
        <a-form layout="inline">

          <a-form-item label="机构名称">
            <a-input autocomplete="off" placeholder="请输入机构查询" v-model="queryParam.name.value"></a-input>
          </a-form-item>
          <a-form-item label="机构类型">
            <ak-dict-select-tag dict-code="sysOrgType"  v-model="queryParam.orgType.value" />
          </a-form-item>

          <a-form-item label="机构电话">
            <a-input autocomplete="off" placeholder="请输入机构电话查询" v-model="queryParam.mobile.value"></a-input>
          </a-form-item>
          <a-form-item>
            <span  class="table-page-search-submitButtons">
              <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
              <a-button type="primary" @click="searchReset" icon="reload">重置</a-button>
              <a-upload  v-has="'SYS:DEPART:ADD'"
                          :showUploadList="false"
                          :customRequest="customImportRequest"
                          accept=".xls,.xlsx">
                <a-button  type="primary" :loading="importLoading" icon="import">
                  <span v-if="!importLoading">导入</span>
                  <a-progress v-if="importLoading" :percent="importPercent" size="small" status="active"/>
                </a-button>
              </a-upload>

            <a-button
              type="primary"
              icon="export"
              @click="handleExport">
              <span v-if="!exporting">导出</span>
              <a-progress v-if="exporting" :percent="exportPercent" size="small" status="active"/>
            </a-button>
              
            <a-button type="primary" icon="add" v-has="'SYS:DEPART_TOP:ADD'" @click="handleAdd({data:{}})">新增顶级部门</a-button>
           
          </span>
          </a-form-item>

        </a-form>
      </div>
      <!-- 树-->
      <a-table v-if="dataSource.length>0"
        ref="table"
        bordered
        size="middle"
        :rowKey="(record)=>{return record.data.id}"
        :columns="columns"
        :dataSource="dataSource"
        :pagination="false"
        :loading="loading"
        :defaultExpandAllRows="true"
        :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
        @change="handleTableChange">

      <span slot="ellipsis" slot-scope="text">
        <ak-ellipsis :value="text" :length="25"/>
      </span>

        <span slot="action" slot-scope="text, record" class="table-operator">
          <a v-has="'SYS:DEPART:ADD'"   @click="handleAdd(record)">添加子机构</a>
          <a v-has="'SYS:DEPART:EDIT'"   @click="handleEdit(record)">编辑</a>
          <a v-has="'SYS:DEPART:DEL'" v-if="record.children==null && record.buildInFlag != 'TRUE'"
                     @click="handleDelete(record.data.id)">删除</a>
        </span>


      </a-table>
      <depart-modal ref="departModal" @ok="modalFormOk"></depart-modal>
    </a-card>
</template>
<script>
import DepartModal from "./modules/DepartModal";
import AkEllipsis from "../../components/akfh/AkEllipsis"
import { sysDepartUrl } from "../../api/url";
import  AkfhListMixin  from '../../mixin/AkfhListMixin';
import AkDictSelectTag from "../../components/akfh/AkDictSelectTag";
// 表头
const columns = [
  {
    title: "机构编码",
    dataIndex: "data.no",
    scopedSlots: { customRender: "ellipsis" }
  },
  {
    title: "机构名称",
    dataIndex: "data.name",
    scopedSlots: { customRender: "ellipsis" }
  },
  {
    title: "机构类型",
    dataIndex: "data.orgType_dictText",
    scopedSlots: { customRender: "ellipsis" }
  },
  {
    title: "负责人",
    align: "center",
    dataIndex: "data.leaderUsersRealnames",
    scopedSlots: { customRender: "ellipsis" }
  },
  {
    title: "联系电话",
    align: "center",
    dataIndex: "data.mobile",
    scopedSlots: { customRender: "ellipsis" }
  },
  {
    title: "传真",
    align: "center",
    dataIndex: "data.fax",
    scopedSlots: { customRender: "ellipsis" }
  },
  {
    title: "地址",
    align: "center",
    dataIndex: "data.address",
    scopedSlots: { customRender: "ellipsis" }
  },
  {
    title: "备注",
    align: "center",
    dataIndex: "data.memo",
    scopedSlots: { customRender: "ellipsis" }

  },
  {
    title: "排序",
    align: "center",
    dataIndex: "data.sort",
  },
  {
    title: "操作",
    align: "center",
    dataIndex: "action",
    scopedSlots: { customRender: "action" }
  }
];
export default {
  name: "DepartList",
  components: {
    AkDictSelectTag,
    DepartModal, AkEllipsis
  },
  mixins:[AkfhListMixin],
  data() {
    return {
      queryParam:{
        name:{
          type:'like',
          column:'name',
          value:''
        },
        orgType:{
          type:'eq',
          column:'orgType',
          value:''
        },
        mobile:{
          type:'like',
          column:'mobile',
          value:''
        }
      },
      isorter:{
        column: 'sort',
        order: 'asc',
      },
      ipagination:false,
      columns: columns,
      url: sysDepartUrl,

    };
  },
  mounted() {

  },
  methods: {
    handleEdit(record){
      this.$refs.departModal.edit(record.data);
      this.$refs.departModal.title = "编辑";
    },
    handleAdd(record) {
      this.$refs.departModal.add({parentId:record.data.id});
      this.$refs.departModal.title = "新增";
    },


  }
};
</script>
<style scoped>

</style>
